<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/vue.js"></script>
	</head>
	<body>
		<h1>{{address}}</h1>
		<div id="app">
		<h2>{{address}}</h2>
		<h3>{{address}}</h3>
		<h4>{{address}}</h4>
		<h5>{{address}}</h5>
		<h6>{{address}}</h6>
		
		<!--要操纵Vue的数据，必须设置一个指令v-model
		1、操纵页面元素view 数据model发生变化
		2、操纵数据model，页面元素view也随着发生变化
		vue和jquery有本质区别
		1、js它专门有一套api需要学习，需要额外记忆
		2、jQuery本质封装js，简化js写法，又独创了一套api,需要额外记忆
		3、vue完全不同思路，只需要操作数据，不同的组件操作方式完全相同，不需额外记忆
		-->
		<input type="text" id="address"  v-model="address"  />
		</div>
	</body>
	<script>
		 var vm = new Vue({
			 el: "#app",
			 data: {
				 address:"安徽安庆"
			 }
		 });
	</script>
</html>
